<template>
  <div class="layout">
    <Layout :style="{ minHeight: '100vh' }">
      <Header>
        <Menu name="11" mode="horizontal" theme="dark" active-name="1">
          <div class="layout-logo ">
            <h4 class="text-light">酒钢翻车机系统监管平台</h4>
          </div>
          <div class="layout-nav">
            <Menu
              mode="horizontal"
              style="float: right;"
              theme="dark"
              active-name="1"
            >
              <Submenu name="3">
                <template slot="title">
                  <Icon type="ios-people" />
                  <span>admin</span>
                </template>
                <MenuItem name="3-2">
                  <a
                    @click="logout"
                    href="javascript:void(0)"
                    :class="'w-100 h-100'"
                    >退出登录</a
                  >
                </MenuItem>
              </Submenu>
            </Menu>
          </div>
        </Menu>
      </Header>
      <Layout>
        <Sider hide-trigger :class="'bg-light'">
          <Menu
            active-name="1-2"
            theme="light"
            width="auto"
            :open-names="['1']"
          >
            <Submenu>
              <template slot="title">
                <Icon type="ios-navigate"></Icon>
                翻车机管理
              </template>
              <MenuItem :to="{ name: 'machine' }">设备管理</MenuItem>
              <MenuItem :to="{ name: 'program' }">项目管理</MenuItem>
              <!-- <MenuItem :to="{ name: 'watch' }">数据监控</MenuItem> -->
			  <MenuItem :to="{ name: 'allwatch' }">历史数据</MenuItem>
            </Submenu>
          </Menu>
        </Sider>

        <Layout>
          <Content :class="'m-2'">
            <router-tab :class="''" />
          </Content>
        </Layout>
      </Layout>
    </Layout>
  </div>
</template>

<script>
import local from '../../common/_local'
// import store from '../../common/store.js'
export default {
  data() {
    return {
      jumpToInfiStatistics: '/infoStatistics',
      currentUser: {},
      interviewTotal: null,
      backviewTotal: null,
      allInterviewTotal: null,
      allBackviewTotal: null,
      showFlag: true,
    }
  },
  methods: {
    logout: function() {
	  this.$store.state.isShow = false
    },
  },
  created: function() {},
  mounted() {
  },
  watch: {
    $route: {
      handler: function(val, oldVal) {},
    },
  },
  computed: {
  },
}
</script>

<style scoped>
.layout {
  position: relative;
  border-radius: 4px;
  overflow: hidden;
}

.layout-logo h4 {
  /* width: 300px;
		height: 30px;
		background: #5b6270;
		border-radius: 3px; */
  float: left;
  position: relative;
  top: 15px;
  left: 100px;
}

.layout-nav {
  width: calc(100% - 100px);
  margin: 0 auto;
  margin-right: 20px;
}
</style>
